<template>

  <div class="content-box">
    <nav-title title="离职审批" />
    <div class="regulations-box">
      <div class="title">基本信息</div>
      <v-wastage-info v-bind:baseInfo="baseInfo"></v-wastage-info>
    </div>
    <div class="regulations-box">
      <div class="title">详细信息</div>
      <simple-line title="离职日期" v-bind:value="baseInfo.cLzAppDt" />
      <simple-line title="离职原因说明" v-bind:value="baseInfo.terReason" />
      <simple-line v-if="baseInfo.terReason='其他'" title="其他原因说明" v-bind:value="baseInfo.comments256" />
      <simple-line title="离职交接信息备注" v-bind:value="baseInfo.cOtherExplain" />
    </div>

    <!-- 流程信息 -->
    <div class="regulations-box">
      <div class="title">流程信息</div>
      <!-- <edit-option-line label="签署竞业协议" :readonly="!editVal['cTerIsQsjyxy']" :vals="ynVal" :boldtitle="true" v-model="baseInfo.cTerIsQsjyxy"></edit-option-line> -->
      <simple-line title="签署竞业协议" v-bind:value="baseInfo.cTerIsQsjyxyValue" v-if="displayVal['cTerIsQsjyxy']" />
      <simple-line title="关键岗位" v-bind:value="baseInfo.cTerIsGjgwValue" v-if="displayVal['cTerIsGjgw']" />
      <simple-line title="存在借款" v-bind:value="baseInfo.cTerIsJkValue" v-if="displayVal['cTerIsAjfje']" />
      <simple-line title="优化备案人员" v-bind:value="baseInfo.cTerIsSfyhbaryValue" v-if="displayVal['cTerIsSfyhbary']" />
      <simple-line title="集体户口" v-bind:value="baseInfo.cTerIsJthkValue" v-if="displayVal['cTerIsJthk']" />
      <simple-line title="培训协议" v-bind:value="baseInfo.cTerIsPxxyValue" v-if="displayVal['cTerIsPxxy']" />
      <simple-line title="有安家费" v-bind:value="baseInfo.cTerIsAjfValue" v-if="displayVal['cTerIsAjf']" />
      <simple-line title="安家费金额" v-bind:value="baseInfo.cTerIsAjfje" v-if="displayVal['cTerIsAjfje']" />
      <simple-line title="有流程固化" v-bind:value="baseInfo.cYesno2Value" v-if="displayVal['cYesno2']" />
      <simple-line title="近三届大学生" v-bind:value="baseInfo.cIsDxsValue" v-if="displayVal['cIsDxs']" />
      <simple-line title="有下属信息" v-bind:value="baseInfo.cYesnoValue" v-if="displayVal['cYesno']" />



      <div v-if="leaveReasonShow">
        <edit-date-line label="实际离职日期" :placeholder="editVal['cLastWorkDt'] ? '请选择' : ''" :readonly="!editVal['cLastWorkDt']"
          :boldtitle="true" v-model="baseInfo.cLastWorkDt"></edit-date-line>
        <edit-option-line label="离职原因" @on-change="loadWastageDetailReason" :placeholder="editVal['actionReason'] ? '请选择' : ''"
          :readonly="!editVal['actionReason']" :vals="reasonList" :boldtitle="true" v-model="baseInfo.actionReason"></edit-option-line>
        <edit-option-line label="离职详细原因" :placeholder="editVal['cTerDetail'] ? '请选择' : ''" :readonly="!editVal['cTerDetail']"
          :vals="detailReasonList" :boldtitle="true" v-model="baseInfo.cTerDetail"></edit-option-line>
        <file-line label="附件" :important="true" :fileitems="baseInfo.wfFiles" :boldtitle="true" />
      </div>
    </div>

    <div class="regulations-box" v-if="leaveReasonShow">
      <div class="info-label">离职原因描述</div>
      <div class="info-label-text">
        <textarea placeholder="请在这里输入..." :readonly="!editVal['cTerResnDescr']" rows="5" v-model="baseInfo.cTerResnDescr"></textarea>
      </div>
    </div>

    <div class="regulations-box">
      <div class="title">分权引用</div>
      <fqyy-line :editting="false" :fqyyFlag="fqyyInfo.cFqyyFlag" :noFqyySum="fqyyInfo.noFqyySum" :noFqyyRatio="fqyyInfo.noFqyyRatio"
        :fqyyMsg="fqyyInfo.cFqyyDetail" ref="fqyy"></fqyy-line>
    </div>


    <!-- 流程图 -->
    <div class="regulations-box">
      <div class="title">流程图</div>
      <v-flow-charts :transNum="cTransactionNbr"></v-flow-charts>
    </div>

    <!-- 审批意见 -->
    <div class="regulations-box" v-if="approved == '0'&&baseInfo.cStepType!='C' && baseInfo.cIsChuanyue != 'Y'">
      <div class="info-label">审批意见</div>
      <div class="info-label-text">
        <textarea placeholder="请在这里输入..." rows="5" v-model="cComments"></textarea>
      </div>
    </div>

    <!-- 底部按钮 -->
    <div style="height: 50px"></div>
    <!-- 底部按钮 -->
    <div v-if="approved == '0'">
      <operation-btn :cApprovalSw="baseInfo.cApprovalSw" :cDenySw="baseInfo.cDenySw" :cPushbackAllSw="baseInfo.cPushbackAllSw"
        :cAddSw="baseInfo.cAddSw" :cTransactionNbr="baseInfo.cTransactionNbr" :cWfType="baseInfo.cWfType" :cReadSw="baseInfo.cIsChuanyue"
        :cStepType="baseInfo.cStepType" :cComments="cComments" :approveBizType="'wastage'" :getBizParams="getBizParams"
        :validSubmit="validSubmit"></operation-btn>
    </div>
  </div>

</template>

<script>
  import { Selector, Group,dateFormat } from "vux";
import {getWastage,getWastageReason,getCompensateProcess,getWastageDetailReason, getWastageApprove, getFqyyInfo} from "../../api/api";
import fqyyLine from "../../components/basic/FqyyLine"
import SimpleLine from '../../components/basic/SimpleLine'
import EditDateLine from '../../components/basic/EditDateLine'
import EditOptionLine from '../../components/basic/EditOptionLine'
import FileLine from '../../components/basic/FileLine'
import vWastageInfo from "../formalStaff/wastageInfo";
import operationBtn from "./common/operationBtn";
import vFlowCharts from "../formalStaff/common/flowChart";
import { json2Form,publicUrl } from "../../util/http";
import CommonUtil from '../../components/basic/util'

export default {
  components: {
    vWastageInfo,
    Selector,
    Group,
    vFlowCharts,
    SimpleLine,
    EditOptionLine,
    EditDateLine,
    FileLine,
    operationBtn,
    fqyyLine
  },
  created() {

  },
  mounted() {
    CommonUtil.tryLogin(this).then(()=>{
      this.cTransactionNbr = this.$route.query.cTransactionNbr;
      this.approved = this.$route.query.approved;
      this.stepNbr = this.$route.query.stepNbr;
      //离职审批信息
      this.getWastageInfo();
      //获取字典表信息
      this.getDic();

      getFqyyInfo({'cTransactionNbr':this.cTransactionNbr,'processType':'wastage'}).then(res => {
                this.fqyyInfo = res.retData;
            })
    })

  },
  data() {
    return {
      fqyyInfo:{
        fqyyFlag:'',
        fqyyDetail:''
      },
      approved:'0',
      baseInfo: {},
      ynVal:[{ value: "是", key: "Y" }, { value: "否", key: "N" }],

      displayVal: [],
      editVal: [],

      reasonList: [],
      detailReasonList: [],

      //按钮点击的参数
      cTransactionNbr: this.$route.query.cTransactionNbr,
      cComments: "",
      leaveReasonShow:false

    };
  },
  methods: {
    getDic() {
      //离职原因字典
      getWastageReason({ setId: "XC001"})
        .then(res => {
          this.reasonList = [];
          if (res && res.retCode === "000000") {
            for (let i = 0; i < res.retData.length; i++) {
              this.reasonList.push({
                value: res.retData[i].descr,
                key: res.retData[i].actionReson
              });
            }
          }
        })
        .catch(res => {});

        //离职详细原因字典
        this.loadWastageDetailReason()
    },
    loadWastageDetailReason() {
      getWastageDetailReason({ actionReason: this.baseInfo.actionReason })
        .then(res => {
          this.detailReasonList = [];
          if (res && res.retCode === "000000") {
            for (let i = 0; i < res.retData.length; i++) {
              this.detailReasonList.push({
                value: res.retData[i].descr,
                key: res.retData[i].rsTerDetail
              });
            }
          }
        })
        .catch(res => {});
    },
    getWastageInfo() {
      this.$vux.loading.show();
      let params = {
        cTransactionNbr: this.cTransactionNbr,
        stepNbr: this.stepNbr
      };
      getWastage(params)
        .then(res => {
          this.$vux.loading.hide();
          if (res && res.retCode === "000000") {

            this.baseInfo = res.retData
            CommonUtil.updateFileUrl(this.baseInfo.wfFiles);
            this.baseInfo.terminationDt = dateFormat(
              res.retData.terminationDt,
              "YYYY-MM-DD"
            );
            this.baseInfo.cLzAppDt = dateFormat(
              res.retData.cLzAppDt,
              "YYYY-MM-DD"
            );
            let auths = res.retData.authFileds;
            for(var i=0;i<auths.length;i++) {
              this.displayVal[auths[i].fieldKey] = auths[i].isDisplay
              this.editVal[auths[i].fieldKey] = auths[i].isEdit
            }
            CommonUtil.fillYNShow(this.baseInfo, ["cTerIsQsjyxy", "cTerIsGjgw", "cTerIsJk", "cTerIsSfyhbary", "cTerIsJthk", "cTerIsPxxy", "cTerIsAjf"])
            // console.log(this.baseInfo.emplid);
            // console.log(this.$store.state.eid);
            if(this.$store.state.eid!=null && this.baseInfo.emplid!=null && this.baseInfo.emplid != this.$store.state.eid){
              this.leaveReasonShow = true;
            }


          } else {
            this.$vux.alert.show({
              title: "提示",
              content: res.retMsg
            });
          }
        })
        .catch(res => {
          this.$vux.loading.hide();
          this.$vux.alert.show({
            title: "警告",
            content: "网络异常，请稍后重试"
          });
        });
    },
    validSubmit() {

      let result = (!this.editVal["cLastWorkDt"] || CommonUtil.valid(this, this.baseInfo, "cLastWorkDt", "必须选择离职日期！")) &&
            (!this.editVal["actionReason"] || CommonUtil.valid(this, this.baseInfo, "actionReason", "必须选择离职原因！")) &&
            (!this.editVal["cTerDetail"] || CommonUtil.valid(this, this.baseInfo, "cTerDetail", "离职详细原因"));
      return result;

    },
    getBizParams(){
      var _this = this;
      var params = {};
      ["cLastWorkDt", "actionReason", "cTerDetail", "cTerResnDescr"].forEach(function(key){
        if(key && _this.editVal[key] && _this.baseInfo[key]) {
          params[key] = _this.baseInfo[key]
        }
      });
      return params;
    }
  }
};
</script>
<style type="text/scss" lang="scss">
  @import "../../styles/staff.scss";
.reject-main {
  position: relative;
  .reject-group {
    position: absolute;
    top: -80px;
    left: 0px;
    button {
      margin-bottom: 1px;
    }
  }
}
.slide-fade-enter-active {
  transition: all 0.1s ease;
}
.slide-fade-leave-active {
  transition: all 0.2s cubic-bezier(1, 0.5, 0.8, 1);
}
.slide-fade-enter, .slide-fade-leave-to
/* .slide-fade-leave-active for below version 2.1.8 */ {
  transform: translateY(10px);
  opacity: 0;
}
</style>
